<template>
  <div id="kuang" :style="ur()" @scroll="gotoScroll">
    <dan
      v-for="(name, i) in jiaxiaoarr"
      :jiaarr="jiaxiaoarr[i]"
      :jiaolian="jiaolian[i]"
      @click.native="xiang(i)"
      :key="i"
      @done="handleDone"
    >
    </dan>
  </div>
</template>
<script>
import dan from "./dan.vue";
export default {
  name: "kuang",
  data() {
    return {
      jiaxiaoarr: [],
      storePrice: [],
      jiaolian: [],
      num: "",
      gao: 0,
      itemList: [],
      shu: 0,
      code: 0,
      lat: 0,
      lng: 0,
      url: "@/assets/back.png",
      pan: false,
      r: [
        15260375977617148094, 13483283115447227080, 112991204761545502080,
        13374400234439747080, 11684426056396037086, 115916046073452994092,
        18100682717540370075, 18176821415468066089, 17544582036056702080,
        14985009905208658094, 113669965277669514109, 12578518392577738103,
        115876496622446036096, 112793014988018994100, 115558488642244472096,
      ],
      i: 0,
    };
  },
  components: {
    dan,
  },
  methods: {
    cha() {
      // console.log("创建");
      this.jiaxiaoarr = [];
      this.gao = 0;
      var _this = this;
      if (this.coach == "jiaxiao") {
        this.axios
          .get(
            `/api/web/v3/${this.coach}/list-contact-baoming.htm?_r=19166778433005956095&cityCode=${this.code}&sortType=${this.number}&latitude=${this.lat}&longitude=${this.lng}&page=${this.gao}&limit=10&courseType=`
          )
          .then((res) => {
            this.itemList = res.data.data.itemList;
            this.jiaxiaoarr = this.itemList;
          });
      } else {
        this.axios
          .get(
            `/api/web/v3/${this.coach}/list-contact-baoming.htm?_r=18822516910220275076&cityCode=${this.code}&sortType=${this.number}&latitude=${this.lat}&longitude=${this.lng}&page=${this.gao}&limit=10&courseType=`
          )
          .then((res) => {
            if (res.data.success) {
              this.i = 0;
              this.itemList = res.data.data.itemList;
              this.jiaolian = this.itemList;
              console.log(this.itemList);
              console.log("获取成功");
            } else {
              this.i = this.i + 1;
              console.log(this.i);
              console.log(this.r[this.i]);
              if (this.i < this.r.length - 1) {
                this.cha();
                console.log(this.i);
              } else {
                this.i = 0;
                this.cha();
              }
              console.log("获取失败");
            }
          });
      }
    },
    xiang(i) {
      // console.log(this.jiaxiaoarr[i]);
      this.$router.push({
        name: "jiaxiang",
        params: {
          jiaxiaoarr: this.jiaxiaoarr[i],
        },
      });
      sessionStorage.setItem("id", this.jiaxiaoarr[i].jiaxiaoId);
      sessionStorage.setItem("latitude", this.jiaxiaoarr[i].latitude);
      sessionStorage.setItem("longitude", this.jiaxiaoarr[i].longitude);
    },
    jieshou() {
      setTimeout(() => {
        this.code = sessionStorage.getItem("code");
        this.lat = sessionStorage.getItem("lat");
        this.lng = sessionStorage.getItem("lng");
        this.cha();
      }, 300);
    },
    gotoScroll() {
      if (
        document.getElementById("kuang").scrollTop >=
        0.735 * document.documentElement.clientHeight +
          this.gao * 1.47 * document.documentElement.clientHeight
      ) {
        this.gao++;
        this.axios
          .get(
            `/api/web/v3/${this.coach}/list-contact-baoming.htm?_r=19166778433005956095&cityCode=${this.code}&sortType=${this.number}&latitude=${this.lat}&longitude=${this.lng}&page=${this.gao}&limit=10&courseType=`
          )
          .then((res) => {
            if (this.coach == "jiaxiao") {
              this.itemList = res.data.data.itemList;
              for (var i = 0; i < this.itemList.length; i++) {
                this.jiaxiaoarr.push(this.itemList[i]);
                if (res.data.data.itemList[i].storePrice == 0) {
                  this.storePrice[i] = "面议";
                } else {
                  this.storePrice[i] = res.data.data.itemList[i].storePrice;
                }
              }
            } else {
              console.log("教练");
            }
          });
      }
    },
    handleDone() {
      this.pan = true;
      this.shu++;
      if (this.shu == 9) {
        console.log("a");
        this.pan = false;
        this.shu = 0;
      }
    },
    ur() {
      return {
        background: "url(" + require("@/assets/back.png"),
        backgroundPosition: "center",
      };
    },
    huan() {
      console.log(this.coach);
      this.cha();
    },
  },

  created() {
    this.jieshou();
  },
  props: {
    number: Number,
    coach: String,
  },
  watch: {
    number: "cha",
    coach: "huan",
    $route(to, from) {
      if (to.path == "/") {
        console.log("跳转中");
        this.jieshou();
        this.cha();
      }
    },
  },
};
</script>
<style scoped>
#kuang {
  width: 100%;
  height: 75vh;
  overflow-y: scroll;
}
</style>